<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="utf-8"/>
    <title>更新博文</title>
	<link rel="stylesheet" href="assets/css/editored/bootstrap.css">
    <link rel="stylesheet" href="assets/css/editored/github.css"/>
    <link rel="stylesheet" href="css/editormd.css"/>
<!--    <link rel="shortcut icon" href="https://pandao.github.io/editor.md/favicon.ico" type="image/x-icon"/> -->
	<script src="assets/vuejs/vue/jquery.min.js"></script>
	<script src="assets/vuejs/vue/popper.min.js"></script>
	<script src="assets/vuejs/vue/bootstrap.min.js"></script>
</head>
<body>
	<!-- 导航栏 -->		
		<div class="">
			
		</div>
	
</div>
<div id="layout">
	<div class="container mt-5">
		<div class="input-group mb-3">
		  <input type="text" class="form-control" aria-label="Sizing example input" aria-describedby="inputGroup-sizing-lg" id="title" name="title" autocomplete="off" placeholder="请输入标题...">
		  <div class="input-group-append">
		    <button class="btn btn-outline-secondary" type="button" id="my_submit" name="my_submit">更新博文</button>
		  </div>
		  
		</div>
		<div class="input-group mb-3">
		  <div class="input-group-prepend">
		    <label class="input-group-text" for="inputGroupSelect01">分类</label>
		  </div>
		  <select class="custom-select" id="kind">
		    <option selected value="学习笔记">学习笔记</option>
		    <option value="面试笔试">面试笔试</option>
			<option value="踩坑记录">踩坑记录</option>
		    <option value="数据库">数据库</option>
			<option value="前端">前端</option>
			<option value="后端">后端</option>
		  </select>
		</div>
	</div>
	
    <div id="test-editormd" style="margin-top: 60px;">
        <textarea style="display:none;" id="coding"></textarea>
        <textarea class="editor-md-html" name="editor-md-html"></textarea>
		
    </div>
	
</div>
<script src="assets/vuejs/vue/jquery.min.js"></script>
<script src="assets/vuejs/vue/editormd.min.js"></script>
<script src="assets/vuejs/publicjs.js"></script>

<script type="text/javascript">
    var testEditor;
 
 
    $(function () {
		if(sessionStorage.getItem("email")==null){
			alert("请先登录！");
			window.location.href="form-modern-login.html";
		}
		
		var essayID = window.location.search;
		var essayid = essayID.split("=");

		

        testEditor = editormd("test-editormd", {
            width: "96%",//编辑器大小官方默认90%
            height: 640,
            syncScrolling: "single",
            path: "lib/",//这个编辑器文件的lib路径
            saveHTMLToTextarea : true,//注意3：这个配置，textarea可以提交
 
            emoji: false,//emoji表情，默认关闭
            /**上传图片相关配置如下*/
            imageUpload : true,
            imageFormats : ["jpg", "jpeg", "gif", "png", "bmp", "webp"],
            // imageUploadURL : baseUrl+'/upload/test',//注意你后端的上传图片服务地址
			imageUploadURL : 'http://81.70.178.39:8081/upload/test',//注意你后端的上传图片服务地址
            onload: function () {
				// console.log('onload', this);
				//this.fullscreen();
				//this.unwatch();
				//this.watch().fullscreen();
				//this.width("100%");
				//this.height(480);
				//this.resize("100%", 640);
				//编辑
				axios.get(base_ure+'/essay/EID?EID='+essayid[1]).then(function(res){
						console.log(res);
						 if(res.data.code == "200")
						 {
							 document.getElementById("title").value = res.data.data.title;
							 document.getElementById("coding").value = res.data.data.content;
						 }
						else{
							alert(res.data.msg);
							window.location.href = "home.html";
						}
				},function(err){
						 alert("网络出错！");
				});
            },
			// 通过editor.getMarkdown()可以获取到你所写的文章内容。可以使用encodeURIComponent()方法将文章内容编码后存储。
			// 编码后的内容可以在后端调用URLDecoder.decode(content, "UTF-8")来解码
			// var blogContent = encodeURIComponent(editor.getMarkdown())
			// article.content = blogConent;
			
            //editorTheme: "pastel-on-dark",//编辑器的主题颜色
            theme: "gray",//顶部的主题
            previewTheme: "light",//显示的主题
			// value: "123",
			// appendMarkdown: content,
            //editor.md期望得到一个json格式的上传后的返回值，格式是这样的：
            
            // {
            //     success : 0 | 1,           // 0 表示上传失败，1 表示上传成功
            //     message : "提示的信息，上传成功或上传失败及错误信息等。",
            //     url     : "图片地址"        // 上传成功时才返回
            // }
           
		   
        });
		
		

		
		// 更新
		document.getElementById("my_submit").onclick = function(){
			// console.log(testEditor.getMarkdown());
			// console.log(testEditor.getHTML());
			// 发送 POST 请求
			// console.log(document.getElementById("title").value);

			axios({
			  method: 'post',
			  url: '/essay/edit',
			  baseURL: base_ure,
			  data: {
				email: sessionStorage.getItem("email"),
				uuid: sessionStorage.getItem("uuid"),
			    title: document.getElementById("title").value,
				content: testEditor.getMarkdown(),
				kind: document.getElementById("kind").value,
				eid: essayid[1],
			  },
			  responseType:'json',
			  responseEncoding:'utf8'
			}).then(function(response){
				// console.log(response);
				if(response.data.code == "200")
				{
					alert("更新成功！");
					window.location.href="home.html";
				}
				else{
					alert(response.data.msg);
				}
			}).catch(function(error){
				alert("network error");
				console.log(error);
			});
		};
		
		// 草稿
		// document.getElementById("my_grat").onclick = function(){
		// 	// console.log(testEditor.getMarkdown());
		// 	// console.log(testEditor.getHTML());
		// 	// 发送 POST 请求
		// 	// console.log(document.getElementById("title").value);
			
		// 	axios({
		// 	  method: 'post',
		// 	  url: '/essay/create',
		// 	  baseURL: baseUrl,
		// 	  data: {
		// 		email: sessionStorage.getItem("email"),
		// 	    title: document.getElementById("title").value,
		// 		content: testEditor.getMarkdown(),
		// 		kind: document.getElementById("kind").value,
		// 	  },
		// 	  responseType:'json',
		// 	  responseEncoding:'utf8'
		// 	}).then(function(response){
		// 		// console.log(response);
		// 		if(response.data.code == "200")
		// 		{
		// 			alert("发表成功！");
		// 			window.location.href="home.html";
		// 		}
		// 		else{
		// 			alert(response.data.msg);
		// 		}
		// 	}).catch(function(error){
		// 		alert("network error");
		// 		console.log(error);
		// 	});
		// };
		
        /*
        // or
        testEditor = editormd({
            id      : "test-editormd",
            width   : "90%",
            height  : 640,
            path    : "../lib/"
        });
        */
    });
</script>
<script src="assets/vuejs/publicjs.js"></script>
<script src="assets/vuejs/vue/axios.min.js"></script>
<script src="assets/vuejs/vue/vue.js"></script>
</body>
</html>